<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath %>">
<title>****会员管理界面****</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<%-- 引用layui.css --%>
<link rel="stylesheet" type="text/css" href="<%=basePath %>js/layui/css/layui.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath %>css/common.css" />
</head>
<body>
	<div class="ibox">
		<div class="ibox-content bodycss">
			<!-- 表单搜索 开始 -->
		 	<section class="panel panel-padding ">
			<form class="layui-form layui-form-pane form-search"
				onsubmit="return false" method="get">
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员状态</label>
					<div class="layui-input-inline" >
					  <div  style="width:150px">
						<select name="userStatu" id="userStatu" > <!-- 订单状态：0:已取消;10(默认):待确认;20:已确认;30:已配货;40:已发货;50:已收款;60:已退货 -->
							<option value="">请选择</option>
							<option value="1">正常</option>
							<option value="0">禁用</option>
						</select>
                      </div>
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员名称</label>
					<div class="layui-input-inline">
						<input name="userName" id="userName"  placeholder="请输入会员名称"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员电话</label>
					<div class="layui-input-inline">
						<input name="userPhone" id="userPhone"  placeholder="请输入电话"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员卡号</label>
					<div class="layui-input-inline">
						<input name="userNumberCard" id="userNumberCard" placeholder="请输入会员卡号"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">机顶盒号码</label>
					<div class="layui-input-inline">
						<input name="userId" id="userId" placeholder="请输入机顶盒号"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<button class="layui-btn layui-btn-primary" lay-submit lay-filter="seach">
						<i class="layui-icon"></i> 搜 索
					</button>
				</div>
			</form>
			</section>
			<!-- 表单搜索 结束 -->
			<section class="panel panel-padding ">
				<div class="ibox-toolbar">
					<button class="layui-btn layui-btn-sm" id="addUser" >增加会员</button>
				</div>
			<table class="layui-table"
				lay-data="{
	                        id: 'manager',
	                        width:'auto',
	                        url:'memberCon/toShowTable.do',
	                        page:true,
	                        even:true,
	                        skin:'row',
	                        limits:[10,20,30,40,50],
	                        limit:10,
							method:'post'                      
	                        }"
				lay-filter="memberManager" id = "dataTable">
				<thead>
					<tr>
						<th lay-data="{checkbox:true,disabledKey:'check_status',disabledKeyValue:'1,2'}"></th>
						<th lay-data="{type:'numbers', width:50}">序号</th>
						<th lay-data="{field:'user_name', width:80,align:'center'}">名称</th>
						<th lay-data="{field:'user_id', width:120,align:'center'}">机顶盒号</th>
						<th lay-data="{field:'user_phone', width:120,align:'center'}">电话</th>
						<th lay-data="{field:'statu', width:60,align:'center',templet:'#m_type'}">状态</th>
						<th lay-data="{field:'user_integral', width:80,align:'center'}">积分</th>
						<th lay-data="{field:'city_name', width:100,align:'center',templet:'#cityname'}">城市名称</th>
						<th lay-data="{field:'service_point_name', width:160,align:'center'}">服务站点</th>
						<th lay-data="{field:'address_detail', width:120,align:'center'}">详细地址</th>
						<th lay-data="{field:'delivery_way', width:150,align:'center',templet:'#fangshi'}">提货方式</th>
						<th lay-data="{field:'user_card_number', width:100,align:'center'}">会员卡号</th>
						<th lay-data="{field:'create_time', width:150,align:'center'}">创建时间</th>
						<th lay-data="{fixed: 'right', width:230, align:'center', toolbar: '#popedomBar'}">操作</th>
					</tr>
				</thead>
			</table>
			</section>
		</div>
	</div>
	
	<!-- 添加用户的方法 -->
	<div id ="addUserForm" style = "display:none;">
			<form action="" class="layui-form" style="margin:30px;" method="post" >
				<div class="layui-form-item">
					<label class="layui-form-label">会员tvn号</label>
					<div class="layui-input-block">
						<input type="text" name="user_id" required  id = "user_id"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">会员名称</label>
					<div class="layui-input-block">
						<input type="text" name="user_name" required  id = "user_name"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">会员电话</label>
					<div class="layui-input-block">
						<input type="text" name="user_phone" required  id = "user_phone"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">详细地址</label>
					<div class="layui-input-block">
						<input type="text" name="address_detail" required  id = "address_detail"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">会员积分</label>
					<div class="layui-input-block">
						<input type="text" name="user_integral" required  id = "user_integral"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<!-- 添加的弹出框的两个按钮 -->
				<div class="layui-form-item">
					<div class="layui-input-block">
						<input class = "layui-btn" lay-submit lay-filter="addUserButton" value = "提交">
						<input class = "layui-btn layui-btn-primary" type = "reset" value = "重置">
					</div>
				</div>
			</form>
		</div>
	<script type="text/html" id="m_type">	
	    {{#  if(d.statu == "0") {  }}
			<font color="#000000">禁用</font>
		{{#  } else if(d.statu == "1") {  }}
			<font color="#00ff00">正常</font>
		{{#  }  }}
    </script>
    <script type="text/html" id="fangshi" >
		{{# if(d.delivery_way == "0"){ }}
			<font color="#DDA0DD">上门送</font>
		{{# } else if(d.delivery_way == "1"){ }}
			<font color="#8B008B">自己取</font>
		{{# } }}
	</script>
	<script type="text/html" id="cityname" >
		{{# if(d.city_name == "null"){ }}
			<font color="#DDA0DD">没有哟</font>
		{{# } else if(d.city_name != "null") { }}
			<font color="#DDA0DD">d.city_name</font>
		{{# } }}
	</script>
	<script type="text/html" id="receptTime" >
		{{# if(d.receipt_time == ""){ }}
			<font color="#DDA0DD">任意时间</font>
		{{# } }}
	</script>
	<script type="text/html" id="popedomBar">
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete" >删除</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="disable" >禁用</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="activation" >激活</a>
    </script>
    <script type="text/javascript" src="<%=basePath%>js/layui/layui.js"></script>
	<script type="text/javascript">
	layui.config({ base: "<%=basePath%>/js/common/"}).use(["common", "element", "layer", "form", "table", "jquery"], function(){
			var elem = layui.element;
			var layer = layui.layer;
			var form = layui.form;
			var table = layui.table;
			var $ = layui.jquery;
			layui.common.init();			
			/**
			 * 监听刷新表格
			 */
			form.on('submit(seach)', function(data){
				table.reload('manager', {
					where: data.field,
				});
				return false;
			});
			/*
			 * 监听行事件
			 */
			 table.on('tool(memberManager)',function(tableData){
			 		var data = tableData.data;
			 		var even = tableData.event;
			 		var id = data.user_id;//传递到后台的参数
			 		if(even == 'delete'){//执行删除的操作
			 			$.ajax({
			 				method : 'post',		
			 				url : '${pageContext.request.contextPath}/memberCon/deleteUser.do',
			 				data : {
			 					"id" : id
			 				},
			 				success : function(data){
			 					if(data.satausCode == 200){
			 						layer.msg(data.message, {icon: 6,time: 2000});
			 						table.reload('manager',{
										where : data.field
									})
			 					}else{
			 						layer.msg(data.message, {icon: 5,time: 2000});
			 					}
			 				}
			 			})
			 		}else if(even == 'disable'){
			 			$.ajax({
			 				method : 'post',
			 				url : '${pageContext.request.contextPath}/memberCon/disableUserById.do',
			 				data : {
			 					"id" : id
			 				},
			 				success : function(data){
			 					if(data.satausCode == 200){
			 						layer.msg(data.message, {icon: 6,time: 2000});
			 						table.reload('manager',{
										where : data.field
									})
			 					}else{
			 						layer.msg(data.message, {icon: 5,time: 2000});
			 					}
			 				}
			 			})
			 		}else if(even == 'activation'){
			 				$.ajax({
				 				method : 'post',
				 				url : '${pageContext.request.contextPath}/memberCon/activationUserById.do',
				 				data : {
				 					"id" : id
				 				},
				 				success : function(data){
				 					if(data.satausCode == 200){
				 						layer.msg(data.message, {icon: 6,time: 2000});
				 						table.reload('manager',{
											where : data.field
										})
				 					}else{
				 						layer.msg(data.message, {icon: 5,time: 2000});
				 					}
				 				}
			 			})
			 		
			 		}
			 })
			 
			  /*
			     *  增加用户的方法
			  */
			  $("#addUser").on("click",function(data){
			 	  console.log(data);
			  	  layer.open({
	           			type : 1,
	           			title : "添加会员列表",
	           			content : $('#addUserForm'),
	           			//content : 'memberCon/toAddUser.do',
	           			area : ['650px','450px'],
	           			anim : 5,
						isOutAnim: true,
	                    maxmin: true,
	                    resize: false,
	                    moveOut: true,
	                    zIndex: 99999,	
	                    end : function(){
				 	 }	
	           	})
			})
			/*
			   *监听添加会员的按钮事件
			 */
			form.on('submit(addUserButton)',function(data){//data代表的是表单里面的数据，是一个对象
				$.ajax({
						method : 'post',
						url : '${pageContext.request.contextPath}/memberCon/addUsermethod.do',
						data : data.field,
						dataType : "json",
						success : function(data){
							 //进行判断
							 if(data.satausCode == 200){
							 	var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
				                parent.layer.close(index); //再执行关闭
				               // parent.location.reload();//刷新父页面，注意一定要在关闭当前iframe层之前执行刷新
								parent.layer.msg(data.message,{icon : 6});
								var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
	                            parent.layer.close(index); //再执行关闭
	                            parent.layui.table.reload('manager');
							 }else{
								layer.msg(data.message,{icon : 8});							 
							 }
						}
				})
			})
		});
</script>
</body>
</html>
